import ReactDOM from 'react-dom'
import React, { Component } from 'react'

class App extends Component {

  state = {
    count: 0
  }

  add = () => {
    // add 属于react的事件处理函数
    // this.setState({ count: this.state.count + 1 })
    // this.setState({ count: this.state.count + 1 })
    // console.log(this.state.count)
    // 表现出“异步”
    setTimeout(()=>{
      this.setState({ count: this.state.count + 1 })
      this.setState({ count: this.state.count + 1 })
      console.log(this.state.count)
      // 没有被reac管理到，表现出同步
    },0)
  }

  render() {
    console.log('render')
    return (
      <div className='app'>
        <div>计数器：{this.state.count}</div>
        <button onClick={this.add}>+1</button>
      </div>
    )
  }
}


ReactDOM.render(<App />, document.getElementById('root'))